import React, { useEffect, useState } from 'react';import { createNativeStackNavigator } from '@react-navigation/native-stack';
import LoginLayout from './(auth)/_layout'
import NotFoundScreen from './not-found';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import TabLayout from './(tabs)/_layout';
import TranslationProvider from '@/components/common/translation/TranslationProvider';
import MyLayout from './my/_layout';
import SquareLayout from './square/_layout';
import ChatLayout from './chat/_layout';
import { Provider } from 'react-redux';
import store from '../store/postindex'
import '../styles/global.css'
import chatScreen from './chat/detail'
import friends from './friends/index'
import IndexLayout from './index/details'
import photoAlbum from './index/photoAlbum'

import interaction from './interaction/thumbs_up'
import seen from './interaction/seen'
import like_me from './interaction/like_me'
import footprint from './interaction/footprint'
import comments from './interaction/comments'
import application from './interaction/application'


import MyScreen from './(tabs)/my'
import * as SecureStore from 'expo-secure-store';
import { NavigationProp, useNavigation } from '@react-navigation/native';

type RootStackParamList = {
  '(tabs)': undefined;
  '(auth)': undefined;
  // 其他路由的参数类型
};


const Stack = createNativeStackNavigator();

export default function RootLayout() {

  const navigation = useNavigation<NavigationProp<RootStackParamList>>();
  const [token, setToken] = useState<string | null>(null);
  const [isLogin, setIsLogin] = useState<boolean>(false);

  const getToken = async () => {
    const token = await SecureStore.getItem('token');
    setToken(token);
    token && setIsLogin(true);
  }

  useEffect(() => {
    getToken();
    isLogin ? navigation.navigate('(tabs)') : navigation.navigate('(auth)');
  }, [token])
  return (
    <Provider store={store}>
      <TranslationProvider>
        <SafeAreaProvider>
          <Stack.Navigator
            initialRouteName="(tabs)" id={undefined}
            screenOptions={{ headerShown: false }}
          >
            <Stack.Screen name="(auth)" component={LoginLayout} />
            <Stack.Screen name="(tabs)" component={TabLayout} />
            <Stack.Screen name="my" component={MyLayout} />
            <Stack.Screen name="chat" component={ChatLayout} />
            <Stack.Screen name="not-found" component={NotFoundScreen} />
            <Stack.Screen name='square' component={SquareLayout}></Stack.Screen>
            <Stack.Screen name='chatScreen' component={chatScreen}></Stack.Screen>
            <Stack.Screen name='friends' component={friends}></Stack.Screen>
            <Stack.Screen name='details' component={IndexLayout}></Stack.Screen>
            <Stack.Screen name='photoAlbum' component={photoAlbum}></Stack.Screen>
            <Stack.Screen name='interaction' component={interaction}></Stack.Screen>
            <Stack.Screen name='seen' component={seen}></Stack.Screen>
            <Stack.Screen name='like_me' component={like_me}></Stack.Screen>
            <Stack.Screen name='footprint' component={footprint}></Stack.Screen>
            <Stack.Screen name='comments' component={comments}></Stack.Screen>
            <Stack.Screen name='application' component={application}></Stack.Screen>
            {/* <Stack.Screen name="mine" component={MyScreen} /> */}
          </Stack.Navigator>
        </SafeAreaProvider>
      </TranslationProvider>
    </Provider>

  );
}
